$color-text: #262626
$color-warning: #fd7e14
$color-danger: #dc3545
$color-success: #28a745
$color-primary: #007bff
$color-waiting: #8a2be2

:host
  display: flex
  flex-direction: column
  height: 100%
  overflow-y: auto

lib-utask-box
  [app-box-header]
    nz-button-group
      float: right
  [app-box-content]
    nz-form-item:last-child
      margin-bottom: 5px

nz-page-header-extra
  nz-switch
    margin: 0 10px
  [nz-button]
    margin: 0

.task-description
  margin-top: 15px
.template-description
  margin-top: 15px

.steps-viewer
  overflow: auto

.utask_comments
  padding: 0
  .utask_comment
    list-style: none
    margin-top: 1rem
    margin-bottom: 1rem
    background: #fafafa
    padding: 12px 16px 16px
    border: 1px solid #dadce0
    -webkit-box-shadow: 0 4px 6px rgba(0,0,0,.06)
    box-shadow: 0 4px 6px rgba(0,0,0,.06)
    -webkit-transition-property: background-color
    transition-property: background-color
    -webkit-transition-duration: .2s
    transition-duration: .2s

.bloc_status
  display: inline-block
  margin-right: 10px
  padding: 2px 8px
  text-align: center
  color: $color-text
  background: #F0F0F0
  border-radius: 4px

.task_state
  &_WONTFIX,
  &_CANCELLED
    background: $color-warning
    color: white
  &_BLOCKED
    background: $color-danger
    color: white
  &_DONE
    background: $color-success
    color: white
  &_TODO, &_RUNNING
    background: $color-primary
    color: white
  &_WAITING, &_DELAYED
    background: $color-waiting
    color: white

lib-utask-steps-list
    margin-bottom: 15px
    height: 400px
    display: flex
    flex-direction: column

lib-utask-steps-viewer
    height: 100%
    min-height: 400px

.resolution_state
  &_WONTFIX, &_CANCELLED, &_PAUSED, &_ERROR
    background: $color-warning !important
    color: white !important
  &_SERVER_ERROR, &_BLOCKED_MAXRETRIES, &_BLOCKED, &_BLOCKED_BADREQUEST, &_BLOCKED_FATAL
    background: $color-danger !important
    color: white !important
  &_DONE
    background: $color-success !important
    color: white !important
  &_TODO, &_RUNNING
    background: $color-primary !important
    color: white !important
  &_WAITING, &_TO_AUTORUN_DELAYED
    background: $color-waiting !important
    color: white !important

.inputs
  display: flex
  flex-direction: column

.input
  .key
    &::after
      content: ": "

  .value
    font-family: monospace

.ant-dropdown-trigger
  height: 24px
  padding: 0